<template>
   <MyCard>

   </MyCard>
   <MyCard>
      <MyTable :data="couponData.rows" :columns="columns" v-model:pageData="pageData" :total="couponData.total">
         <template #toolbar>
            <el-button type="primary" @click="$router.push('/admin/marketing/store_coupon_issue/create')"
               v-permission='"/admin/marketing/store_coupon_issue/create"'>
               添加优惠卷</el-button>
         </template>
         <template #state>
            <el-switch>
               <template #default="scoped">
                  <el-switch v-model="scoped.row.is_show" :active-value="1" :inactive-value="0" />
               </template>
            </el-switch>
         </template>
         <template #action="{ row }">
            <el-button link type="primary">领取记录</el-button>
            <el-button link type="primary" @click="toUpdated(row._id)"
               v-permission="'/admin/marketing/store_coupon_issue/update/:_id'">编辑</el-button>
            <el-button link type="primary">复制</el-button>
            <el-button link type="primary">删除</el-button>
         </template>
      </MyTable>

   </MyCard>
</template>

<script setup lang="ts">
import { useFindData } from '@/composables/findData';
import { onMounted, ref, watch } from 'vue';
import { useRouter } from 'vue-router';
const { couponData, getCouponJoint } = useFindData();
const pageData = ref({
   currentPage: 1,
   pageSize: 4,
});
const router = useRouter();

const toUpdated = (_id: string) => {
   // router.push(`/admin/marketing/store_coupon_issue/update/${_id}`);
   router.push('/admin/marketing/store_coupon_issue/update/' + _id);
   // router.push({
   //    // name: 'UpdatedCoupon',
   //    // params: { _id: _id }
   // })
}
const columns = [
   { label: '优惠券名称', prop: 'name' },
   { label: '优惠券类型', prop: 'typeId.name' },
   { label: '面值', prop: 'price' },
   { label: '领取方式', prop: 'post_type' },
   { label: '是否开启', prop: 'state' },
   { label: '操作', prop: 'action', width: 240 },
];
watch(pageData, () => {
   getCoupon();
}, { deep: true })

onMounted(() => {
   getCoupon();
})

function getCoupon() {
   getCouponJoint(pageData.value)
}
</script>

<style scoped></style>